/* 分割线基础样式 */
.divider {
    display: flex;
    align-items: center;
    margin: 16px 0;
    transition: all 0.3s ease;
}

/* 水平分割线 */
.divider-horizontal {
    width: 100%;
}

.divider-horizontal::before {
    content: '';
    flex: 1;
    height: 1px;
    background: #d9d9d9;
    transition: background 0.3s ease;
}

.divider-horizontal::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #d9d9d9;
    transition: background 0.3s ease;
}

/* 分割线文字 */
.divider-text {
    padding: 0 12px;
    color: #999;
    font-size: 14px;
    white-space: nowrap;
    transition: color 0.3s ease;
}

/* 垂直分割线 */
.divider-vertical {
    height: 20px;
    width: 1px;
    background: #d9d9d9;
    margin: 0 12px;
    transition: background 0.3s ease;
}

/* 分割线类型 */
.divider-dashed::before,
.divider-dashed::after {
    border-top: 1px dashed #d9d9d9;
    background: none;
}

.divider-dotted::before,
.divider-dotted::after {
    border-top: 1px dotted #d9d9d9;
    background: none;
}

/* 分割线颜色 */
.divider-primary::before,
.divider-primary::after {
    background: #1890ff;
}

.divider-success::before,
.divider-success::after {
    background: #52c41a;
}

.divider-warning::before,
.divider-warning::after {
    background: #faad14;
}

.divider-error::before,
.divider-error::after {
    background: #ff4d4f;
}

/* 分割线大小 */
.divider-small {
    margin: 8px 0;
}

.divider-large {
    margin: 24px 0;
}

/* 分割线粗细 */
.divider-thick::before,
.divider-thick::after {
    height: 2px;
}

/* 响应式 */
@media (max-width: 600px) {
    .divider {
        margin: 12px 0;
    }
    
    .divider-text {
        font-size: 12px;
        padding: 0 8px;
    }
}
